<template>
	<view  >
		<view class="search-line-block skeleton-rect" >
			<navigator id="address_start" openType="navigate" url="/pages/bus/search_address/index?type=1&&op=bus_index" >
				<view class="address-item address-start skeleton-rect">
					<image class="address-icon" src="../../../static/images/bus/station_start_icon.png"></image>
					<view bindtap="onStartAddressTap" :class="!from_address.name?'search-input-text-nocontent':''" class="address-name single-line-ellipsis"> {{from_address.name||'请输入出发地'}} </view>
				</view>
			</navigator>
			<image class="address-line-icon" src="../../../static/images/bus/station_start_bar_end.png"></image>
			<view class="separation-line"></view>
			<navigator id="address_end" openType="navigate" url="/pages/bus/search_address/index?type=2&&op=bus_index"> 
				<view class="address-item address-start skeleton-rect">
					<image class="address-icon" src="../../../static/images/bus/station_end_icon.png"></image>
					<view bindtap="onEndAddressTap" class="address-name single-line-ellipsis" style="color:#cacaca">请输入目的地</view>
				</view>
			</navigator>
		</view>
		
		<view class="" style="margin-top: 15px;margin-left: 8px;">
			<vtabs  v-model="current" bgColor="none" lineHeight="6rpx"
			 activeColor="#000" color="#afafaf" :bold="false" activeFontSize="36rpx"
			  :scroll="true" :tabs="list" @change="change"> </vtabs>
		</view>
		<!-- #ifdef MP-WEIXIN  -->
		<view style="margin: 15px;">
			<localBar  :show="showLocalAuth"></localBar>
		</view>
		<!-- #endif -->
		<view style="" v-if="current==0">
			<view v-if="nearListLine.length"  v-for="(item,index) in nearListLine" :key="index">
				<lineb  :lineInfo="item"></lineb>
			</view>
			<view v-if="!nearListLine.length">
				<emptyPage title="暂无附近线路"></emptyPage>
			</view>
			<view class="safe-height"></view>
		</view>
		<view style="" v-if="current==1">
			<view v-if="collectLine.length"  v-for="(item,index) in collectLine" :key="index">
				<lineb  :lineInfo="item"></lineb>
			</view>
			<view  v-if="!collectLine.length"  >
				<emptyPage title="暂无收藏线路"></emptyPage>
			</view>
			<view class="safe-height"></view>
		</view>
		
		<view class="navfooter">
			<view @click="goAllLine" class="nav-item display-flex-column display-flex-align-center ">
				<view class="iconfont icon-fangdajing21 nav-icon"></view>
				<view class="nav-text">
					查询线路
				</view>
			</view>
			<view @click="goMyOrder" class="nav-item display-flex-column display-flex-align-center ">
				<view class="iconfont icon-chepiao23 nav-icon"></view>
				<view class="nav-text">
					我的车票
				</view>
			</view>
			<view  @click="openwxkf" class="nav-item display-flex-column display-flex-align-center ">
				<view class="iconfont icon-kefu14 nav-icon"></view>
				<view class="nav-text">
					联系客服
				</view>
			</view>
			<view  @click="gofeedback" class="nav-item display-flex-column display-flex-align-center ">
				<view class="iconfont icon-jianyi32 nav-icon"></view>
				<view class="nav-text">
					投诉建议
				</view>
			</view>
		</view>
	</view>
</template>
<script>
import {toLogin} from '@/libs/login.js';
import {mapGetters} from "vuex";
import  vtabs  from "@/components/vTabs/index.vue"
import  lineb  from "@/components/line/index.vue"
import  emptyPage  from "@/components/emptyPage.vue"
import Cache from '../../../utils/cache';
import { CITY_INFO, FROM_ADDRESS, LOCATION_CITY_INFO} from '../../../config/cache.js'
import  localBar  from "@/components/local-bar/index.vue"
import {
		openKf
	} from "@/utils";
 import {
		getNearLine, getCollectLine
	} from '@/api/bus.js';
export default {
	components: { vtabs, emptyPage, lineb ,localBar},
	computed: mapGetters(['isLogin']),
	data() {
		return {
			from_address: {},
			to_address: {},
			list: [ '附近线路','收藏线路'],
			current: 0,
			nearListLine: [],
			collectLine: [],
			showLocalAuth: false,
		};
	},

	
	onShow() {
		var that = this
		that.from_address = Cache.has(FROM_ADDRESS)? JSON.parse(Cache.get(FROM_ADDRESS)):''
		if(this.isLogin && !this.collectLine.length){
			this.getCollectLine()
		}
		
		// #ifdef MP
		uni.getSetting({
		    success: (res) => {
		    let authSetting = res.authSetting
		    if (authSetting['scope.userLocation']) {
		      // 已授权
			  that.showLocalAuth = false
		    } else {
		     that.showLocalAuth = true
		    }
		  }
		})
		//#endif
		
	},
	
	onPullDownRefresh(){
		this.$nextTick( () =>{

			// if(this.current == 2){
			// 	this.$refs.bus.busRefresh()
			// }
	
		})
		
	},
	onLoad(option) {
		
		this.getLocation()

	},
	onReady() {
		// console.log('this.$refs.home',this.$refs.home.initShow())
	},
	//方法
	methods: {
		getLocation(){
			var that = this
			
			
			if(Cache.has(LOCATION_CITY_INFO)){
				var current_loc = JSON.parse(Cache.get(LOCATION_CITY_INFO))
				 that.getNearLine(current_loc.lat,current_loc.lng)
			} else {
				
				uni.getLocation({
					type: 'gcj02',
					success: function(res) {
						  that.getNearLine(res.latitude,res.longitude)
					},
					fail(res) {
					}
				});
			}
			
		},
		getNearLine(lat,lng){
			var city = Cache.has(CITY_INFO)? JSON.parse(Cache.get(CITY_INFO)) : ""
			uni.showLoading({
				title:"正在加载中"
			})
			getNearLine({
				from_lat: lat,
				from_lng: lng,
				city_id: city? city.id: ""
			}).then(res => {
				uni.hideLoading()
				this.$set(this,'nearListLine',res.data)
				console.log('nearListLine',this.nearListLine)
			}).catch(err =>{
				uni.hideLoading()
			})
		},
		getCollectLine(){
			var city = Cache.has(CITY_INFO)? JSON.parse(Cache.get(CITY_INFO)) : ""
			getCollectLine({
				cityId: city? city.id: ""
			}).then( res => {
				this.$set(this,'collectLine',res.data)
				
			})
		},
		change(index) {
			
			console.log('index',index)
			if(index == 1){
				if(!this.isLogin){
					toLogin()
					return;
				} 
			}
			this.current = index;
		},
		goAllLine(){
			uni.navigateTo({
				url:"/pages/bus/all_line/index"
			})
		},
		goMyOrder(){
			if(!this.isLogin){
				toLogin()
			}else {
				uni.navigateTo({
					url:"/pages/users/order_bus_list/index?status=1"
				})
			}
			
		},
		openwxkf() {
			openKf()
		},
		gofeedback(){
			uni.navigateTo({
				url:"/pages/users/feedback/index"
			})
		},
		
	}
};
</script>
<style lang="scss" scoped>
.search-line-block {
	    background: #fff;
	    border-radius: 10rpx;
	    box-shadow: 0 7rpx 30rpx 0 rgba(0,0,0,.1);
	    color: #1b1b1b;
	    margin: 24rpx 24rpx 0 24rpx;
	    position: relative;
	}
	
	.search-line-block .address-item {
	    align-items: center;
	    display: flex;
	    height: 102rpx;
	    margin-right: 42rpx;
	}
	
	.search-line-block .address-name {
	    flex: 1;
	    font-size: 32rpx;
	}
	
	.search-line-block .address-icon {
	    height: 18rpx;
	    margin: 0 25rpx 0 50rpx;
	    width: 18rpx;
	}
	
	.search-line-block .address-line-icon {
	    height: 42rpx;
	    left: 56rpx;
	    position: absolute;
	    top: 50%;
	    transform: translateY(-50%);
	    width: 6rpx;
	}
	
	.search-line-block .separation-line {
	    background: #d8d8d8;
	    height: 1rpx;
	    margin-left: 93rpx;
	    margin-right: 42rpx;
	}
	
	.navfooter{
		color: #666;
		background-color: #fff;
		bottom: 0;
		box-shadow: 0rpx -2rpx 8rpx rgba(0,0,0,.1);
		display: flex;
		font-size: 32rpx;
		justify-content: space-between;
		left: 0;
		padding-bottom: env(safe-area-inset-bottom);
		position: fixed;
		text-align: center;
		width: 100%;
		z-index: 100;
	}
	.nav-item {
	    flex-grow: 1;
	    position: relative;
	}
	.nav-icon{
		padding-top: 16rpx;
		font-size: 20px;
		color: #000;
		padding-bottom: 8rpx;
	}
	.nav-text{
		color: #666;
		font-size: 20rpx;
		line-height: 28rpx;
		padding-bottom: 12rpx;
	}
	.safe-height{
		height: 140rpx;
		padding-bottom: env(safe-area-inset-bottom);
	}
</style>
